<!DOCTYPE html>
<html>

<head>
    <title>实时汽车业务数据平台注册</title>
    <meta charset="utf-8">
    <meta content="IE=edge" http-equiv="X-UA-Compatible">
    <meta content="width=device-width, initial-scale=1.0" name="viewport">
    <link crossorigin="anonymous" href="https://cdn.staticfile.org/twitter-bootstrap/5.3.2/css/bootstrap.min.css"
          integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" rel="stylesheet">
    <link href="css/style.css" rel="stylesheet" type="text/css">
    <script src="js/jquery-1.11.0.min.js"></script>
    <script crossorigin="anonymous"
            integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL"
            src="https://cdn.staticfile.org/twitter-bootstrap/5.3.2/js/bootstrap.bundle.min.js"></script>
    <script src="https://code.iconify.design/iconify-icon/1.0.7/iconify-icon.min.js"></script>
</head>

<body class="bg-dark">
<header id="header">

    <nav class="navbar navbar-expand-lg padding-small px-lg-4">
        <div class="container-fluid">
            <div class="main-logo">
                <a href="index.html">
                    <h3 style="color: white"> 欢迎注册实时汽车业务数据平台</h3>
                </a>
            </div>
            <button aria-controls="offcanvasNavbar" class="navbar-toggler mb-0" data-bs-target="#offcanvasNavbar"
                    data-bs-toggle="offcanvas" type="button">
                <iconify-icon class="hamburger-menu" icon="system-uicons:menu-hamburger"></iconify-icon>
            </button>
            <div class="btn-wrap d-flex my-4 my-lg-0">
                <a class="btn btn-linear btn-medium" href="login.html">登录</a>
                <a class="btn btn-outline-linear btn-medium m-0" href="signin.html">注册</a>
            </div>
        </div>
    </nav>
</header>

<section id="hero">
    <div class="container">
        <h2 class="section-title light text-center my-5 py-5">注册</h2>
    </div>
</section>

<section class="padding-medium pt-0" id="signup">
    <div class="container">
        <div class="col-lg-8 offset-lg-2">
            <form class="form-group flex-wrap" id="form1">
                <div class="form-input col-lg-12 my-4">
                    <input class="form-control bg-blue-trans placeholder-color p-4" id="userName" name="username" placeholder="账号"
                           type="text">
                    <input aria-describedby="passwordHelpBlock" class="form-control bg-blue-trans placeholder-color p-4" id="passWord" name="password"
                           placeholder="密码"
                           type="password">

                    <div class="d-grid my-3">
                        <input class="btn btn-linear btn-medium" onclick="zhuce()" value="注册">
                    </div>
                    <div class="form-text" id="passwordHelpBlocks">
                        <a class="text-primary fw-medium" href="https://www.sxzy.edu.cn/">遇到问题？联系我们</a>
                    </div>
                </div>
            </form>
        </div>
    </div>
</section>
<script type="text/javascript">


    function zhuce() {
        var name = $("#userName").val();
        var pass = $("#passWord").val();
        // 检查用户名和密码是否为空
        if (name === "" || pass === "") {
            alert("账号和密码不能为空！");
            return; // 终止函数执行
        }
        // 检查用户名和密码是否包含空格
        if (name.includes(" ") || pass.includes(" ")) {
            alert("账号和密码不能包含空格！");
            return; // 终止函数执行
        }
        // 检查用户名和密码是否为3-10位的字母或数字
        var pattern = /^[a-zA-Z0-9]{3,10}$/;
        if (!pattern.test(name) || !pattern.test(pass)) {
            alert("账号和密码必须为3-10位的字母或数字！");
            return; // 终止函数执行
        }

        $.ajax({
            type: 'POST',
            url: 'http://127.0.0.1:8080/zhuce',
            dataType: 'json',
            data: {
                uname: name,
                upass: pass

            },
            success: function (data) {
                if (data == 2) {
                    alert("用户名已存在");
                } else {
                    alert("注册成功");
                    window.location.href = "login.html";
                }
            },
            error: function () {
                alert("无法与数据库取得连接!!!");
            }
        });
    }

    // 高级用户申请
    function contactCEO() {
        alert("请联系CEO添加高级用户权限！");
    }
</script>
</body>

</html>